<template>
  <div
    class="percentage"
    style="width: 33%; font-weight: bold; font-size: 16px"
  >
  <div style="display: flex;justify-content: space-between;margin-bottom:20px;"><span style="font-weight: bold;font-size: 18px">AGV工作占比</span>
    <el-date-picker
      v-model="date.createdate"
      type="daterange"
      style="margin-left: 15px;"
      unlink-panels
      range-separator="至"
      value-format="YYYY-MM-DD"
      start-placeholder="开始时间"
      end-placeholder="结束时间"
      @change="handleDateRangeChange"
      clearable
      size="small"
    /></div>
    <dashboard></dashboard>
  </div>
</template>

<script setup>
import { reactive } from "vue";
import dashboard from "./dashboard.vue";
const date = reactive({
  createdate: [],
});
const handleDateRangeChange = (val) => {
  console.log(val);
};
</script>

<style lang="scss" scoped>
.percentage {
  box-sizing: border-box;
  background-color: #fff;
  border-radius: 10px;
  padding: 20px;
}
</style>